<template>
    <div class="detail_module_panel other_info">
        <h3 id="work_student" class="detail_panel_title detail_panel_title_icon other_info_icon">
            {{ $t('common.orderList') }}
        </h3>
        <div class="panel_info_content">
            <el-table :data="tableData" style="width: 100%">
                <el-table-column align="left" :label="$t('common.innerOrderId')" prop="orderId" min-width="150"></el-table-column><!--内部订单号-->
                <el-table-column align="left" :label="$t('common.applyDate')" prop="loanTime" min-width="130"><!--申请时间-->
                    <template slot-scope="scope">{{ scope.row.loanTime | formatDate('yyyy-MM-dd hh:mm:ss') }}</template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.contractAmount')" prop="contractAmount" min-width="80"><!--合同金额-->
                    <template slot-scope="scope" v-if="scope.row.contractAmount">{{ parseInt(scope.row.contractAmount)}}</template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.borrowingCycle')" prop="borrowPeriod" min-width="80"></el-table-column><!--借款期限-->
                <el-table-column align="left" :label="$t('common.arrivalAmount')" prop="loanAmount" min-width="80"><!--到账金额-->
                    <template slot-scope="scope" v-if="scope.row.loanAmount">{{ parseInt(scope.row.loanAmount) }}</template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.shouldRepayAmount')" prop="shouldRepay" min-width="80"><!--应还金额-->
                    <template slot-scope="scope" v-if="scope.row.shouldRepay">{{ parseInt(scope.row.shouldRepay) }}</template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.shouldRepayTime')" prop="repayTime" min-width="130"><!--应还时间-->
                    <template slot-scope="scope">
                        {{ (scope.row.repayTime ? scope.row.repayTime : scope.row.repayTimeOld) | formatDate('yyyy-MM-dd hh:mm:ss')}}
                    </template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.hasRepayAmount')" prop="payedAmount" min-width="80"><!--已还金额-->
                    <template slot-scope="scope" v-if="scope.row.payedAmount">{{ parseInt(scope.row.payedAmount) }}</template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.repayTime')" prop="repayYesTime" min-width="130"><!--还款时间-->
                    <template slot-scope="scope">{{ scope.row.repayYesTime | formatDate('yyyy-MM-dd hh:mm:ss') }}</template>
                </el-table-column>
                <el-table-column align="left" label="展期次数" prop="loanExtensionTimes" min-width="130">
                    <template slot-scope="scope">{{ scope.row.loanExtensionTimes }}</template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.restRepay')" prop="restRepay" min-width="80"><!--挂账金额-->
                    <template slot-scope="scope" v-if="scope.row.restRepay">{{ parseInt(scope.row.restRepay) }}</template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.remitAmount')" prop="repayTime" min-width="130"><!--减免金额-->
                    <template slot-scope="scope">{{ scope.row.csDerateAmount }}</template>
                </el-table-column>
                <el-table-column align="left" :label="$t('common.orderStatus')" prop="loanStatus" min-width="80"><!--订单状态-->
                    <template slot-scope="scope">{{ scope.row.loanStatus | switchLoanStatus}}</template>
                </el-table-column>
            </el-table>
        </div>
        <!--<div class="telPagination">-->
        <!--<el-pagination @current-change="paginationChange" :current-page.sync="pagination.currentPage" :page-size="pagination.pageSize" layout="total, prev, pager, next, jumper" :total="pagination.recordsTotal"></el-pagination>-->
        <!--</div>-->
    </div>
</template>

<script>
    import Pagination from '@/components/pagination';
    import mixin from '@/service/mixin';

    let that = null;
    export default {
        name: 'orderList',
        components: {
            Pagination
        },
        mixins: [mixin],
        props: {
            updateType: {
                type: String
            }
        },
        data() {
            return {
                userId: '',
                tableData: [],
                // currentPage: 1,
                // pagination: {
                //     recordsTotal: 0,
                //     currentPage: 1,
                //     pageSize: 10,
                // },
            };
        },
        watch: {
            updateType(val) {
                if (val === 'orderList') {
                    this.page.currentPage = 1;
                    this.getTableData();
                }
            }
        },
        methods: {
            getTableData() {
                const params = {
                    userId: this.userId,
                    // page: {
                    //     pageNo: this.pagination.currentPage,
                    //     pageSize: this.pagination.pageSize
                    //
                };
                this.$api.tel.queryHisOrderList(params).then((res) => {
                    const {status, data, error} = res;
                    if (status === '1' && error === '00000000') {
                        this.tableData = data || [];
                        // this.pagination.recordsTotal = data.pageCount;
                        this.tableMaxHeight = window.document.body.clientHeight - 300;
                    }
                });
            },
            paginationChange() {
                this.getTableData();
            },
        },
        filters: {
            // 查询订单状态
            switchLoanStatus(orderStatus) {
                switch (orderStatus) {
                    case 'BORROW_AUDIT':
                        return '借款审核中';
                    case 'WAIT_TEL':
                        return '待电核';
                    case 'AUDIT_SUCCESS':
                        return '借款审核通过';
                    case 'AUDIT_REFUSE':
                        return '借款审核拒绝';
                    case 'LOAN_SUCCESS':
                        return '放款成功';
                    case 'LOAN_REFUSE':
                        return '放款拒绝';
                    case 'OVERDUE':
                        return '逾期';
                    case 'SUCCESS_REPAY':
                        return '还款成功';
                    case 'FAIL_REPAY':
                        return '还款失败';
                    case 'PROCESSING_REPAY ':
                        return '还款处理中';
                    default:
                        return '';
                }
            },
        },
        created() {
            that = this;
            const params = this.$route.params;
            this.userId = params.userId;
            if (this.userId) {
                this.getTableData();
            }
        }
    };
</script>

<style lang="scss" scoped>
    .popOver {
        word-break: break-all;
    }

    .video {
        background-color: rgba(0, 0, 0, 0.4) !important;
    }

    .video_icon {
        display: block;
        height: 100%;
        width: 100%;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 32px 32px;
        background-image: url("~@/assets/img/icon_video.png");
    }

    .check_loan_history {
        margin-left: 15px;
    }
</style>
